<!DOCTYPE html>
<html>
<head>
    <title></title>
    <#include "/header.html"/>
    <link rel="stylesheet" href="${request.contextPath}/statics/plugins/bootstrapValidator/css/bootstrapValidator.min.css">
    <script src="${request.contextPath}/statics/plugins/bootstrapValidator/js/bootstrapValidator.min.js"></script>
    <style type="text/css">
        html{
            overflow-y: auto;
        }
        .form-group.required .control-label:after {
            color: #d00;
            content: "*";
            position: absolute;
            margin-left: 8px;
            top:7px;
        }
    </style>
</head>
<body>
<div id="rrapp" v-cloak>
    <div v-show="showList">
        <div class="grid-btn">
            <div class="form-group col-sm-2">
                <input type="text" class="form-control" v-model="exchangeName" @keyup.enter="query"
                       placeholder="商品名称">
            </div>
            <a class="btn btn-default" @click="query">查询</a>

            <#if shiro.hasPermission("gift:pointsexchange:save")>
                <a class="btn btn-primary" @click="add"><i class="fa fa-plus"></i>&nbsp;新增</a>
            </#if>
            <#if shiro.hasPermission("gift:pointsexchange:update")>
                <a class="btn btn-primary" @click="update"><i class="fa fa-pencil-square-o"></i>&nbsp;修改</a>
            </#if>
            <#if shiro.hasPermission("gift:pointsexchange:delete")>
                <a class="btn btn-primary" @click="del"><i class="fa fa-trash-o"></i>&nbsp;禁用</a>
            </#if>
        </div>
        <table id="jqGrid"></table>
        <div id="jqGridPager"></div>
    </div>

    <div v-show="!showList" class="panel panel-default" align="center">
        <div class="panel-heading">{{title}}</div>
        <form class="form-horizontal" style="width:70%!important;" id="exchangeForm">
            <input type="hidden" v-model="pointsExchange.id" name="id">
            <div class="form-group required">
                <div class="col-sm-2 control-label" style="width: 10%;">商品名称</div>
                <div class="col-sm-10" style="width: 40%;">
                    <input type="text" class="form-control" width="80%" v-model="pointsExchange.name" name="name"
                           placeholder="商品名称"/>
                </div>
                <div class="col-sm-2 control-label" style="width: 10%;">所需积分</div>
                <div class="col-sm-10" style="width: 40%;">
                    <input type="text" class="form-control" width="80%" v-model="pointsExchange.points" name="points"
                           placeholder="所需积分"/>
                </div>
            </div>
            <div class="form-group required">
                <div class="col-sm-2 control-label" style="width: 10%;">描述</div>
                <div class="col-sm-10" style="width: 40%;">
                    <input type="text" class="form-control" width="80%" v-model="pointsExchange.remark" name="remark"
                           placeholder="描述"/>
                </div>
                <div class="col-sm-2 control-label" style="width: 10%;">剩余量</div>
                <div class="col-sm-10" style="width: 40%;">
                    <input type="text" class="form-control" width="80%" v-model="pointsExchange.remaining" name="remaining"
                           placeholder="剩余量"/>
                </div>
            </div>
            <div class="form-group required">
                <div class="col-sm-2 control-label" style="width: 10%;">商品图片</div>
                <div class="col-sm-10" style="width: 40%;">
                    <input type="file" class="form-control" width="80%" v-model="pointsExchange.imagesrc" name="imagesrc"
                           placeholder="商品图片"/>
                </div>
                <div class="col-sm-2 control-label" style="width: 10%;">创建时间</div>
                <div class="col-sm-10" style="width: 40%;">
                    <input type="text" class="form-control" width="80%" v-model="createtime" name="createtime"
                           placeholder="生成时间" readonly="readonly"/>
                </div>
            </div>
            <div class="form-group required">
                <div class="col-sm-2 control-label" style="width: 10%;">创建人</div>
                <div class="col-sm-10" style="width: 40%;">
                    <input type="text" class="form-control" width="80%" v-model="account" name="account"
                           placeholder="创建人" readonly="readonly"/>
                </div>
                <div class="col-sm-2 control-label" style="width: 10%;">状态</div>
                <div class="col-sm-10" style="width: 40%;">
                    <select class="form-control" v-model="pointsExchange.flag" name="flag">
                        <option value="1">可用</option>
                        <option value="2">禁用</option>
                    </select>
                </div>
            </div>
            <div class="form-group">
                <a href="#" class="thumbnail">
                    <img :src="pointsExchange.url" alt=" " style="min-height:200px;max-height:500px;">
                </a>
            </div>
            <div class="form-group">
                <div class="col-sm-offset-5 col-sm-2">
                <input type="button" class="btn btn-primary" @click="saveOrUpdate" value="确定"/>
                &nbsp;&nbsp;<input type="button" class="btn btn-warning" @click="reload" value="返回"/>
                </div>
            </div>
        </form>
    </div>
</div>

<script src="${request.contextPath}/statics/js/modules/gift/pointsexchange.js?_${.now?long}"></script>
<script src="${request.contextPath}/statics/js/modules/gift/exchangeValidator.js?_${.now?long}"></script>
</body>
</html>